<script setup lang="ts">
import type { IState } from './type'
import { ButtonOperationType } from '@apps/_share/enums'
import useMicroStore from '@apps/_share/store/micro'
import { RouteName } from '@auth/enums'
import {
  columns,
  schemas,
} from './config'

defineOptions({ name: RouteName.appAdmin })

const state = reactive<IState>({
  schemas,
  tableData: [
    {
      id: '1',
      appName: '权限中心',
      appCode: 'auth',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6061',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '2',
      appName: '配置中心',
      appCode: 'config',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6062',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '3',
      appName: '翻译中心',
      appCode: 'translate',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6063',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '1',
      appName: '权限中心',
      appCode: 'auth',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6061',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '2',
      appName: '配置中心',
      appCode: 'config',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6062',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '3',
      appName: '翻译中心',
      appCode: 'translate',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6063',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '1',
      appName: '权限中心',
      appCode: 'auth',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6061',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '2',
      appName: '配置中心',
      appCode: 'config',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6062',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '3',
      appName: '翻译中心',
      appCode: 'translate',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6063',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '1',
      appName: '权限中心',
      appCode: 'auth',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6061',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '2',
      appName: '配置中心',
      appCode: 'config',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6062',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '3',
      appName: '翻译中心',
      appCode: 'translate',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6063',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '1',
      appName: '权限中心',
      appCode: 'auth',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6061',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '2',
      appName: '配置中心',
      appCode: 'config',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6062',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '3',
      appName: '翻译中心',
      appCode: 'translate',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6063',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '1',
      appName: '权限中心',
      appCode: 'auth',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6061',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6061',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '2',
      appName: '配置中心',
      appCode: 'config',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6062',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6062',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
    {
      id: '3',
      appName: '翻译中心',
      appCode: 'translate',
      domains: [
        {
          env: 'dev',
          envName: '开发环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'test',
          envName: '测试环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'release',
          envName: '预发环境',
          url: 'http://localhost:6063',
        },
        {
          env: 'master',
          envName: '生产环境',
          url: 'http://localhost:6063',
        },
      ],
      status: 1,
      statusName: '开启',
      createName: '五老星1号',
      createTime: '2024-10-24 12:00:00',
      modifyName: '五老星2号',
      modifyTime: '2024-10-25 10:10:20',
      menus: [],
    },
  ],
  pagination: {
    page: 1,
    size: 25,
    total: 10,
  },
})

const {
  $t,
  getBus,
} = useMicroStore()

function onSearch(model: any) {
  console.log({ model })
}

function onReset(model: any) {
  console.log({ model })
}

function onAdd() {

}

function onEdit(type: ButtonOperationType, row: any) {
  console.log({
    type,
    row,
  })
}

getBus.on('close-tab-test', (params: any) => {
  console.log({ params })
})
</script>

<template>
  <UiPageListContainer>
    <template #search>
      <UiFormSearch
        :schemas="state.schemas"
        @reset="onReset"
        @search="onSearch"
      />
    </template>

    <template #operation>
      <ElSpace wrap>
        <ElButton
          type="primary"
          @click="onAdd"
        >
          {{ $t('新增') }}
        </ElButton>

        <!-- <BaseEllipsis
          :tooltip="{ content: '123' }"
        >
          <div class="w-100px">
            人生自古无死，留取丹心赵汗青，和手动阀大放送大法萨芬11
          </div>
        </BaseEllipsis> -->
      </ElSpace>
    </template>

    <template #table>
      <BaseTable
        row-key="id"
        :columns="columns"
        :data="state.tableData"
      >
        <template #domains="{ row }">
          <div
            v-for="domain in row.domains"
            :key="domain.env"
          >
            <span>{{ domain.envName }}: </span>
            <span v-underline>{{ domain.url }}</span>
          </div>
        </template>

        <template #operation="{ row }">
          <ElSpace
            wrap
            :size="16"
            class="pt-8px pb-8px"
          >
            <ElButton
              type="primary"
              link
              size="small"
              @click="onEdit(ButtonOperationType.DETAIL, row)"
            >
              <span v-underline>{{ $t('详情') }}</span>
            </ElButton>

            <ElButton
              type="primary"
              link
              size="small"
              @click="onEdit(ButtonOperationType.EDIT, row)"
            >
              {{ $t('编辑') }}
            </ElButton>

            <ElButton
              type="primary"
              link
              size="small"
            >
              {{ $t('删除') }}
            </ElButton>
          </ElSpace>
        </template>
      </BaseTable>
    </template>

    <template #pagination>
      <BasePagination
        v-if="state.pagination.total > 0"
        v-model:page="state.pagination.page"
        v-model:size="state.pagination.size"
        :total="state.pagination.total"
      />
    </template>
  </UiPageListContainer>
</template>
